import { Component, EventEmitter, Input, Output } from '@angular/core';
import { FormControl } from '@angular/forms';
import { DateService } from './date.service';

import 'rxjs/add/operator/debounceTime';
import 'rxjs/add/operator/distinctUntilChanged';

@Component({
    selector: 'tasks-date',
    templateUrl: 'date.html'
})
export class DateComponent {

    uiDate: any
    searchKey = new FormControl();

    @Input() tasksNum: number;
    @Output() onSearch = new EventEmitter<string>();

    constructor(private dateService: DateService) {
        this.uiDate = {
            dateStr: '',
            dayStr: ''
        }
        dateService.setDate(this.uiDate);

        this.searchKey.valueChanges
            .debounceTime(400)
            .distinctUntilChanged()
            .subscribe(searchKey => {
                this.onSearch.emit(searchKey);
            });

    }

}
